<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>{:$page_info['title']}</title>
<link rel="icon" href="favicon.ico" type="image/ico">
<meta name="keywords" content="">
<meta name="description" content="">
<meta name="author" content="yinqi">
<link href="__STATIC__/admin/css/bootstrap.min.css" rel="stylesheet">
<link href="__STATIC__/admin/css/materialdesignicons.min.css" rel="stylesheet">
<link href="__STATIC__/admin/css/style.min.css" rel="stylesheet">

<link href="__STATIC__/common/select2/select2.css" rel="stylesheet">
<link href="__STATIC__/admin/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css" rel="stylesheet">

<link href="__STATIC__/admin/css/cch.css" rel="stylesheet">
<style type="text/css">
    .ok-btn {display:none;margin:0 5px 0 10px;}
    .no-btn {display:none;}
</style>
</head>
  
<body>
<div class="container-fluid p-t-15">
  
  <div class="row">
    <div class="col-lg-12">
      <div class="card">
        <div class="card-toolbar clearfix">
          <form class="pull-right search-bar" method="get" action="{:url($page_info['action'])}" role="form">
            <input type="hidden" name="user_id" value="{:$user['id']}" />
            {include file="html/search" /}
          
          </form>
          <div class="toolbar-btn-action">
            <a class="btn btn-success m-r-5 search_btn" href="javascript:void(0)"><i class="mdi mdi-magnify"></i> 搜索</a>
          </div>
        </div>
        <div class="card-body">
          <h5>用户姓名:<code>{:$user['truename']}</code> 总折扣:<code>{:$user['total_discount']}</code></h5>
          <div class="table-responsive">
            <table class="table table-bordered">
              <thead>
 
                <tr>
                    <th>名称</th>
                    <th>代码</th>
                    <th>折扣</th>
                </tr>
              </thead>
              <tbody>
                <?php if (empty($list)): ?>
                    <tr><td colspan="100" class="text-center">暂无数据</td></tr>
                <?php else: ?>
                    <?php foreach ($list as $k => $vo): ?>
                    <tr>
                        <td>{:$vo['name']}</td>
                        <td>{:$vo['code']}</td>
                        <td width="30%">
                            <input type="text" name="discount" class="form-control discount-input" value="{:$vo['discount']}" data-code="{:$vo['code']}" data-val="{:$vo['discount']}" style="width: 50%;display:inline;" />
                            <a href="javascript:void(0);" class="btn btn-xs btn-success ok-btn" data-toggle="tooltip" title="确认"><i class="mdi mdi-check"></i></a>
                            <a href="javascript:void(0);" class="btn btn-xs btn-danger no-btn" data-toggle="tooltip" title="取消"><i class="mdi mdi-close"></i></a>
                        </td>
                    </tr>
                    <?php endforeach ?>
                <?php endif ?>
              </tbody>
            </table>
          </div>
 
        </div>
      </div>
    </div>
    
  </div>
  
</div>

<script type="text/javascript" src="__STATIC__/admin/js/jquery.min.js"></script>
<script type="text/javascript" src="__STATIC__/admin/js/bootstrap.min.js"></script>
<script type="text/javascript" src="__STATIC__/admin/js/main.min.js"></script>

<!-- 时间选择器 -->
<script src="__STATIC__/admin/js/bootstrap-datetimepicker/moment.min.js"></script>
<script src="__STATIC__/admin/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script src="__STATIC__/admin/js/bootstrap-datetimepicker/locale/zh-cn.js"></script>

<script src="__STATIC__/common/select2/select2.min.js"></script><!-- 下拉搜索 -->

<script type="text/javascript" src="__STATIC__/admin/js/lyear-loading.js"></script><!-- loading -->
<script type="text/javascript" src="__STATIC__/admin/js/cch.js"></script>
<script type="text/javascript">
    $(function(){
        $("input[name='discount']").on('keyup',function(){
            var cur_discount = parseFloat($(this).val());
            if ( cur_discount > 0 && cur_discount <= 1 && cur_discount != parseFloat($(this).attr('data-val')) ) {
                $(this).nextAll('.ok-btn').show();
                $(this).nextAll('.no-btn').show();
            }else{
                $(this).nextAll('.ok-btn').hide();
                $(this).nextAll('.no-btn').hide();
            }
        });
        $(".ok-btn").on('click',function(){
            var discount_input = $(this).prevAll('.discount-input');
            $.ajax({
                url:'{:url("updateDiscount")}',
                data:{user_id:'{:$user['id']}',product:$(discount_input).attr('data-code'),discount:$(discount_input).val()},
                type:'post',
                dataType:'json',
                success:function(data){
                    console.log(data);
                    if (data.status == 1) {
                        $(discount_input).val(data.discount);
                        $(discount_input).attr('data-val',data.discount);
                        $(discount_input).trigger('keyup');
                    }else{
                        alert(data.msg);
                    }
                }
            });
        });
        $(".no-btn").on('click',function(){
            $(this).prevAll('.discount-input').val($(this).prevAll('.discount-input').attr('data-val'));
            $(this).hide();
            $(this).prevAll('.ok-btn').hide();
        });
    });
</script>
</body>
</html>